<template>
  <div>
    <el-dialog
      :visible.sync="dialogVisible"
      :title="dialogTitle"
      class="layout-dialog"
      width="15%">
      <div v-show="sum===1">
        <div>
          <span>上限</span>
          <el-input
            v-model="echart.max1" 
            class="ipt" 
            placeholder="请输入最大值"/>
        </div>
        <div >
          <span>下限</span>
          <el-input 
            v-model="echart.min1" 
            class="ipt" 
            placeholder="请输入最小值"/>
        </div>
      </div>
      <div v-show="sum===2">
        <div>
          <span>上限</span>
          <el-input
            v-model="echart.max2" 
            class="ipt" 
            placeholder="请输入最大值"/>
        </div>
        <div >
          <span>下限</span>
          <el-input 
            v-model="echart.min2" 
            class="ipt" 
            placeholder="请输入最小值"/>
        </div>
      </div>
      <div v-show="sum===3">
        <div>
          <span>上限</span>
          <el-input
            v-model="echart.max3" 
            class="ipt" 
            placeholder="请输入最大值"/>
        </div>
        <div >
          <span>下限</span>
          <el-input 
            v-model="echart.min3" 
            class="ipt" 
            placeholder="请输入最小值"/>
        </div>
      </div>
      <div v-show="sum===4">
        <div>
          <span>上限</span>
          <el-input
            v-model="echart.max4" 
            class="ipt" 
            placeholder="请输入最大值"/>
        </div>
        <div >
          <span>下限</span>
          <el-input 
            v-model="echart.min4" 
            class="ipt" 
            placeholder="请输入最小值"/>
        </div>
      </div>
      <div v-show="sum===5">
        <div>
          <span>上限</span>
          <el-input
            v-model="echart.max5" 
            class="ipt" 
            placeholder="请输入最大值"/>
        </div>
        <div >
          <span>下限</span>
          <el-input 
            v-model="echart.min5" 
            class="ipt" 
            placeholder="请输入最小值"/>
        </div>
      </div>
      <span 
        slot="footer" 
        class="dialog-footer">
        <el-button 
          @click="no">取 消</el-button>
        <el-button 
          @click="ok">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import definitionEchart from '@/components/ModifyYAxis/definitionEchart'
export default {
  name: 'ModifyYAxis',
  components: { definitionEchart },
  data() {
    return {
      dialogVisible: false,
      dialogTitle: '',
      sum: '1',
      echart: {}
    }
  },
  methods: {
    //接收父级调用方法和sum
    SfTrue(e) {
      this.sum = e
      this.dialogVisible = true
      this.dialogTitle = '定义Y轴刻度范围'
    },
    //弹窗确定按钮
    ok() {
      this.dialogVisible = false
      // 调用父级的弹框确认按钮并传过去改变某y轴最大最小值
      // if (this.sum === 1) {
      //   this.$parent.echart.max1 = this.echart.max1
      //   this.$parent.echart.min1 = this.echart.min1
      // }
      // console.log(this.$parent.echart)
      this.$parent.ok(this.echart)
    },
    // 弹窗取消按钮
    no() {
      this.dialogVisible = false
    }
  }
}
</script>
<style scoped>
.ipt {
  margin: 0 0 10px 4%;
  width: 80%;
}
span {
  color: #fff;
}
</style>
